<template>
	<MyPage title="充值" :isback="true">
		<view slot="gBody">
			<u-form-item label="￥" label-width="80" :label-style="{'font-size':'60rpx'}" class="price-item"><u-input
					v-model="price" type="number" placeholder="金额" :trim="true" :clearable="false"
					:custom-style="{'font-size':'45rpx'}" /></u-form-item>
			<view class="grey u-text-center">充值金额需大于 {{minMoney}} 元</view>
			<view class="main">
				<view class="page-card">
					<u-cell-item title="微信" :arrow="false" @click="type=1">
						<u-icon slot="icon" size="65" name="weixin-circle-fill" color="#2ab047"
							style="margin-right:20rpx"></u-icon>
						<u-icon slot="right-icon" size="38" name="checkmark-circle-fill"
							:color="type==1?'#eeb115':'#ddd'"></u-icon>
					</u-cell-item>
					<u-cell-item title="支付宝" :arrow="false" @click="type=2">
						<u-icon slot="icon" size="65" name="zhifubao-circle-fill" color="#1362ff"
							style="margin-right:20rpx"></u-icon>
						<u-icon slot="right-icon" size="38" name="checkmark-circle-fill"
							:color="type==2?'#eeb115':'#ddd'"></u-icon>
					</u-cell-item>
				</view>
				<u-button type="warning" shape="circle" class="btn" @click="btnSubmit">确定</u-button>
			</view>
		</view>
	</MyPage>
</template>

<script>
	import mixin from "@/libs/mixin.js";
	import {
	 
		Gopay
	} from '@/api/index.js'
	export default {
		mixins: [mixin],
		data() {
			return {
				price: '',
				minMoney: 0.01,
				type: '1'
			}
		},
		onLoad(option) {
			// 获取数据
			this.price = option.money ? option.money : 20;
		},
		methods: {
			// 提交
			btnSubmit() {
				if (!this.price) {
					uni.showToast({
						title: "请输入金额！",
						icon: "none"
					});
					return;
				} else if (!Number(this.price)) {
					uni.showToast({
						title: "请输入正确的金额！",
						icon: "none"
					});
					return;
				} else if (this.price < this.minMoney) {
					uni.showToast({
						title: "充值金额需大于" + this.minMoney + "元呦！",
						icon: "none"
					});
					return;
				};

				//如果没有登录  跳转
				if (!this.$store.state.app.token) {
					this.$utils.redirectTo('/pages/login/login', {
						title: "登录",
						subTitle: "请先登录",
						btnValue: "请先登录",
						url: '/login/login'
					});
				} else {
					uni.request({
						url: 'http://www.txzh.com.cn/api.php?app=Default&act=recharge',
						method: 'POST',
						header: {
							'Content-Type': 'application/x-www-form-urlencoded',
							'X-Requested-With': 'xmlhttprequest'
						},
						data: {
							money: this.price,
							token: this.$store.state.app.token,
							paytype: this.type
						},
						success: res => {
							this.pay(res.data.list.ordersn)
						},
						fail: () => {},
						complete: () => {}
					});
				}

				/*
				this.$utils.redirectTo('/common/success',{
					title:"充值成功！",
					//subTitle:"赶快用账号进行登录吧！",
					btnValue:"返回我的钱包",
					url:'/wallet/wallet'
				});*/




			},
			pay(ordersn) {
				var that = this;
				Gopay({
					token: this.$store.state.app.token,
					ordersn: ordersn,
					paytype: 'recharge',
				}).then(res => { 
				
					if (res.list.err==0) {
						uni.showToast({
							title:res.list.msg,
							icon:'error' 
						})
						return
					} 
					if (that.type == 1) {
						var provider = 'wxpay';
					} else {
						var provider = 'alipay';
					}
					uni.requestPayment({
						provider: provider,
						orderInfo: res.list.data,
						success: function(res) {
							that.$utils.redirectTo('/common/success', {
								title: "充值成功！",
								//subTitle:"赶快用账号进行登录吧！",
								btnValue: "返回我的钱包",
								url: '/wallet/wallet'
							});
						},
						fail: function(err) {
							console.log('fail:' + JSON.stringify(err));
						}
					});


				}).catch(err => {
					console.log("err: " + JSON.stringify(err));
				});



			},
			// #ifndef H5
			// pay(ordersn) {
			//   let selectedProvider = ''
			//     if(this.type==2){
			// 		selectedProvider = 'alipay';
			// 	}
			// 	if(this.type==1){
			// 		selectedProvider = 'wxpay';
			// 	}

			//     return uniCloud.callFunction({
			//       name: 'pay',
			//       data: {
			//         provider:selectedProvider,
			//         outTradeNo: ordersn,
			// 		lx:2
			//       }
			//     }).then((res) => {
			// 		console.log(selectedProvider, ordersn, res);

			//     if (res.result.orderInfo) {
			//       return new Promise((resolve, reject) => {
			//         uni.requestPayment({
			//           // #ifdef APP-PLUS
			//           provider: selectedProvider,
			//           // #endif
			//           // #ifdef MP-WEIXIN
			//           ...res.result.orderInfo,
			//           // #endif
			//           // #ifdef APP-PLUS || MP-ALIPAY
			//           orderInfo: res.result.orderInfo,
			//           // #endif
			//           complete() {
			//             resolve(res.result.outTradeNo)
			//           }
			//         })
			//       })
			//     } else {
			//       throw new Error(res.result.msg)
			//     }
			//   }).then((outTradeNo) => {
			//     return uniCloud.callFunction({
			//       name: 'order-query',
			//       data: {
			//         outTradeNo,
			// 		lx:2
			//       }
			//     })
			//   }).then((res) => {
			//     if (res.result.orderPaid) {

			//       this.$utils.redirectTo('/common/success',{
			//       	title:"充值成功！",
			//       	//subTitle:"赶快用账号进行登录吧！",
			//       	btnValue:"返回我的钱包",
			//       	url:'/wallet/wallet'
			//       });

			//     } else {
			//       uni.showModal({
			//         content: '订单未支付',
			//         showCancel: false
			//       })
			//     }
			//   }).catch((err) => {
			//     uni.showModal({
			//       content: err.message || '支付失败',
			//       showCancel: false
			//     })
			//   })

			// }

			// #endif
		}
	}
</script>

<style lang="scss">
	page {
		background: #f3f3f3;
	}
</style>
<style lang="scss" scoped>
	.price-item {
		width: 250rpx;
		margin: 65rpx auto;

		.u-input__input {
			font-size: 36rpx;
		}
	}

	.main {
		margin: 18rpx 40rpx 0;

		.page-card {
			padding: 20rpx 40rpx;
			border-radius: 20rpx;
			background: #fff;

			/deep/ .u-cell {
				padding: 15rpx 0;

				.u-cell_title {
					font-size: 30rpx;
					color: #333;
				}

				&:last-child:after {
					border: none;
				}
			}
		}

		.btn {
			margin-top: 70rpx;
			background: linear-gradient(to right, #eeb115, #c17306);
			color: #fff !important;
			border: none;
		}
	}
</style>